<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>注册</title>
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
    <link rel="stylesheet" href="../css/com.css">
    <link rel="stylesheet" href="../font-awesome-4.7.0/font-awesome-4.7.0/css/font-awesome.css">
</head>
<body>
  <header class="myheader">
        <div class="header_main">
            <div class="header_left">
                <a href="../index.html">北游论坛 </a>
            </div>
            <div class="header_right">
                <a href="./login.html">
                    <i class="fa fa-user" aria-hidden="true"></i>
                    登录
                </a>
            </div>
        </div>
  </header>
  <main class="formMine">
    <div class="form-group">
        <label for="name">账号</label>
        <input type="text" class="form-control" id="username" placeholder="请输入账号">
    </div>
    <div class="form-group">
        <label for="name">密码</label>
        <input type="password" class="form-control" id="password" placeholder="请输入密码">
    </div>
    <div class="form-group">
        <label for="name">确认密码</label>
        <input type="password" class="form-control" id="aginpassword" placeholder="再次输入密码">
    </div>
    <div>
        <button type="button" class="btn btn-success btn-block">注册</button>
    </div>
</main>
</body>
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="../js/sendAjax.js"></script>
<script>
    /* 
     用户注册：
     1. 点击注册获取 用户名 密码 再次输入的密码
     2. 判断用户输入的内容是否为空只要有一个为空则表示用户没有补充完整信息。
     3. 判断用户输入的密码和第二次输入的密码是否一致，若一致则向服务端发送请求并将用户名 密码传递给后端，若不一致则提示用户两次输入密码不一致。
     4. 后端获取当前要注册的用户名 密码。
     5. 读取存储用户信息的json文件，判断当前用户是否在读取到的列表中若存在则表示已注册，若不存在则表示该用户未注册，将当前用户名 密码添加到列表中并重新写入文件
     6. 写入成功则表示注册成功 写入失败则表示注册失败
    */
   $(".btn-success").click( async ()=>{
    // 获取输入框内容
     let username = $("#username").val();
     let password = $("#password").val();
     let agin = $("#aginpassword").val();
    // 判断用户输入的内容是否为空
    if(!username || !password || !agin){
        alert("请您补充完整信息！！！")
        return
    }
    // 判断用户输入的两次密码是否一致
    if(password !== agin){
        alert("两次密码不一致！")
        return
    }
    
    //  向服务端发送请求
    let res = await sendAjax("/regiest","post",{username,password});
    console.log(res)
    if(res.code==0){
        window.location.href = './login.html'
    }else{
        alert(res.msg)
    }
   })
</script>
</html>